<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link href="/dtpr/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/dtpr/Flat-UI/css/flat-ui.min.css" rel="stylesheet" type="text/css">
    <link href="/dtpr/bootstrap-select/css/bootstrap-select.min.css" rel="stylesheet" type="text/css">
    <link href="/dtpr/tree/dist/bootstrap-treeview.min.css" rel="stylesheet" type="text/css">
    <link href="/dtpr/css/home.css" rel="stylesheet" type="text/css">
    <link href="/dtpr/css/exam.css" rel="stylesheet" type="text/css">
    <script src="/dtpr/bootstrap/js/jquery-3.2.1.min.js"></script>
    <script src="/dtpr/js/home.js"></script>
    <title>章节管理</title>
</head>
<body>
<!--网页头-->
<script src="/dtpr/js/bgHead.js"></script>
<!--网页体-->
<div class="main">
    <div class="p-body">
        <!--页面正文-->
        <div class="p-title">
            <h3 class="text-center">章节管理</h3>
        </div>
        <div class="row" style="margin-bottom: 40px">
            <div class="col-sm-4"></div>
            <div class="col-sm-4">
                <p style="color:grey">注：当所有选项都不选择的时候，可以添加科目。当选择某个选项的时候，新增节点即新增一个子节点。编辑节点即编辑当前节点的名称。删除节点即删除所选择的节点。删除节点后节点下的相关内容也会被一并删除，所以操作时请注意。</p>
            </div>
        </div>
        <div class="row" style="margin-bottom: 40px">
            <div class="col-sm-4"></div>
            <div class="col-sm-4 text-center">
                <button class="btn btn-primary" onclick="addNode()">新增节点</button>
                <button class="btn btn-info" onclick="editNode()">编辑节点</button>
                <button class="btn btn-danger" onclick="deleteNode()">删除节点</button>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-4"></div>
            <div class="col-sm-4">
                <div id="tree"></div>
            </div>
        </div>

        <!--modal-->
        <!--新增节点-->
        <div class="modal fade" id="create-subject" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">新增节点</h4>
                    </div>
                    <div class="modal-body">
                        <div class="row">
                            <label class="col-sm-4 control-label text-right" id="create-subject-label"></label>
                            <div class="col-sm-6">
                                <input maxlength="50" type="text" class="form-control" id="create-subject-input">
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-info" data-dismiss="modal" onclick="sendAddNode()">增加</button>
                        <button class="btn btn-default" data-dismiss="modal">取消</button>
                    </div>
                </div>
            </div>
        </div>
        <!--编辑节点-->
        <div class="modal fade" id="edit-subject" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">编辑节点</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label class="col-sm-4 control-label text-right" id="edit-subject-label"></label>
                            <div class="col-sm-6">
                                <input maxlength="50" type="text" class="form-control" id="edit-subject-input">
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-info" data-dismiss="modal" onclick="sendEditNode()">确定</button>
                        <button class="btn btn-default" data-dismiss="modal">取消</button>
                    </div>
                </div>
            </div>
        </div>
        <!--删除节点-->
        <div class="modal fade" id="delete-subject" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title" id="delete-subject-title">删除节点</h4>
                    </div>
                    <div class="modal-body">
                        <div class="panel panel-default">
                            <div class="panel-body" id="message">此操作将删除<br><br> 	1. 该节点以及该节点下的所有资料<br> 	2. 该节点以及该节点下的所有题目<br> 	3. 在所有试卷里面删除该节点下的题目</div>
                        </div>
                        <div class="checkbox text-info">
                            <label onclick="alDelete()">
                                <input id="chkboxAllowDelete" type="checkbox">我已经充分了解后果，并同意删除
                            </label>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button id="delButton" class="btn btn-danger disabled" data-dismiss="modal" onclick="sendDeleteNode()">确认删除</button>
                        <button class="btn btn-default" data-dismiss="modal">取消</button>
                    </div>
                </div>
            </div>
        </div>
        <!--等待中-->
        <div class="modal fade" tabindex="-1" role="dialog" id="wait">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">正在提交操作</h4>
                    </div>
                    <div class="modal-body">
                        <p>正在提交修改，请稍后&hellip;</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--网页脚-->
<script src="/dtpr/js/foot.js"></script>
<script src="/dtpr/tree/dist/bootstrap-treeview.js"></script>
<script src="/dtpr/html/background/exam/js/control.js"></script>
<script src="/dtpr/Flat-UI/js/flat-ui.min.js"></script>
<script src="/dtpr/bootstrap-select/js/bootstrap-select.min.js"></script>
</body>
</html>